<template>
  <span></span>
</template>

<script>
import NotificationContentMsg from "@/views/division/monitoring/compentent/NotificationContentMsg.vue";

export default {
  name: "NotificationFrame",
  components: {
    // eslint-disable-next-line vue/no-unused-components
    NotificationContentMsg
  },
  data() {
    return {
      notificationsNum: 0, // 存储消息数量，或者可以换成数组来存
      notificationMessage: {
        titleMsg: "",
        contentMsg: "",
        timeMsg: "",
        imgSrc: "",
      }
    };
  },
  methods: {
    addNotification(notificationMessage) {
      this.selfIncreasing();
      const h = this.$createElement;
      const vNode = h('NotificationContentMsg', {
        ref: NotificationContentMsg,
        props: {
          notificationNum: this.notificationsNum,
          contentMsg: notificationMessage.contentMsg,
          timeMsg: notificationMessage.timeMsg,
          imgSrc: notificationMessage.imgSrc
        }
      });
      const notificationDataMsg = {
        title: notificationMessage.titleMsg,
        message: vNode,
        type: 'warning',
        showClose: true,
        duration: 0,
        onClose: this.selfDecrease,
        position: 'top-right',
        dangerouslyUseHTMLString: true,
      }
      this.$notify(notificationDataMsg);
    },
    selfIncreasing() {
      this.notificationsNum++;
    },
    selfDecrease() {
      this.notificationsNum--;
    },
  },
};
</script>

<style>

</style>